{include file="public/toper" /}
<div class="x-nav">
    <span class="layui-breadcrumb">
        <a href="">运营中心管理</a>
        <a href="">会员卡列表</a>
    </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" href="javascript:location.replace(location.href);" title="刷新">
        <i class="layui-icon" style="line-height:30px">&#xe666;</i></a>
</div>
<div class="x-body">
    <div class="layui-row">
        <div class="layui-form layui-col-md12 x-so">
            <input type="text" name="sreach" value=""  style="width:250px;" id="key"   placeholder="请输入名称/描述/额度" autocomplete="off" class="layui-input">
            <div class="layui-input-inline">
                <select name="type" id="type">
                    <option value=".">全部</option>
                    <option value="0">{:MCARD_TYPE0}</option>
                    <option value="1">{:MCARD_TYPE1}</option>
                    <option value="2">{:MCARD_TYPE2}</option>
                    <option value="3">{:MCARD_TYPE3}</option>
                </select>
            </div>
            <div class="layui-input-inline">
                <select name="state" id="state">
                    <option value=".">全部</option>
                    <option value="0">{:MCARD_STATE0}</option>
                    <option value="1">{:MCARD_STATE1}</option>
                    <option value="2">{:MCARD_STATE2}</option>
                </select>
            </div>
            <button class="layui-btn" id="search"><i class="layui-icon">&#xe615;</i></button>
        </div>
    </div>
    <xblock class="demoTable">
        <button class="layui-btn" onclick="x_admin_show('添加会员卡','{:url(\'Mcard/add\')}')"><i class="layui-icon"></i>添加</button>
    </xblock>
    <table class="layui-hide" id="test" lay-filter="test"></table>
</div>
<script type="text/html" id="image">
    <img src="{{d.img}}" class="thumb" thumb="{{ d.img }}"/>
</script>
<script type="text/html" id="images">
    <img src="{{d.imgs}}" class="thumbs" thumbs="{{ d.imgs }}"/>
</script>
<script type="text/html" id="sort">
    <input style="width: 100%" type="text" class="menu-sort j-ajax-input" name="sort" onkeyup="value=value.replace(/[^\d]/g,'')" value="{{d.sort}}" data-value="{{d.sort}}" data-href="{:url('sort')}?table=membership_card&ids={{d.card_id}}">
</script>
<script type="text/html" id="action">
    <button class="layui-btn layui-btn layui-btn-xs"  onclick="x_admin_show('编辑会员卡','{:url(\'Mcard/edit\')}?id={{d.card_id}}')"><i class="layui-icon">&#xe642;</i>编辑</button>
    <button class="layui-btn-danger layui-btn layui-btn-xs del_btn" id="{{d.card_id}}" lay-event="del"><i class="layui-icon">&#xe640;</i>删除</button>
</script>
<script>
    layui.use(['table'], function(){
        var table = layui.table, $ = layui.jquery;
        var layer = layui.layer;
        var loading = layer.load(1, {shade: [0.1,'#fff'] });
        var tableIn = table.render({
            method: 'post',
            elem: '#test'
            ,url: "{:url('Mcard/index')}"
            ,id:'test'
            ,cols: [[
                {field:'card_id', width:80, title: '序号',align: 'center',type:'numbers'}
                ,{field:'name', width:150, title: '名称',align: 'center'}
                ,{title: '图片',width:100,templet: '#image',align: 'center'}
                ,{title: '列表小图',width:100,templet: '#images',align: 'center'}
                ,{field:'type', width:100, title: '类型',align: 'center',templet: function(d){if(d.type==0){return '{:MCARD_TYPE0}';}else if(d.type==1){return '{:MCARD_TYPE1}'; }else if(d.type==2){return '{:MCARD_TYPE2}';}else if(d.type==3){return '{:MCARD_TYPE3}';}}}
                ,{field:'expiry', width:100, title: '有效期',align: 'center',templet: function(d){if(d.expiry==0){return '{:MCARD_EXPIRY0}';}else if(d.expiry==1){return '{:MCARD_EXPIRY1}';}else if(d.expiry==2){return '{:MCARD_EXPIRY2}';}else if(d.expiry==3){ return '{:MCARD_EXPIRY3}'; } }}
                ,{field:'give',width:100,title:'赠送时长',align:'center'}
                ,{field:'price', width:100, title: '销售价',align: 'center'}
                ,{field:'benefit_price', width:100, title: '优惠价',align: 'center'}
                ,{field:'one_commission', width:100, title: '一级佣金',align: 'center'}
                ,{field:'two_commission', width:100, title: '二级佣金',align: 'center'}
                ,{field:'exempted_quota', width:100, title: '免押额度',align: 'center'}
                ,{field:'state', width:100, title: '状态',align: 'center',templet: function(d){if(d.state==0){return '{:MCARD_STATE0}';}else if(d.state==1){return '{:MCARD_STATE1}';}else if(d.state==2){return '{:MCARD_STATE2}';} }}
                ,{width:80,title: '排序',align: 'center',toolbar:'#sort'}
                ,{width: 150,title: '操作', align: 'center', toolbar: '#action'}
            ]]
            ,page: false
            ,limit: 30
            ,limits:[30,60,90,120,150,180,210,240,270,300]
        });
        layer.close(loading);


        //搜索
        $('#search').on('click', function () {
            tableIn.reload({
                where: {key: $('#key').val(),type:$('#type').val(),state:$('#state').val()}
                ,page: {
                    curr: 1 //重新从第 1 页开始
                }
            });
        });


        table.on('tool(test)', function(obj) {
            var data = obj.data;
            if(obj.event === 'del'){
                layer.confirm('您确定要删除【'+data.name+'】吗？',{btnAlign: 'c'}, function(index){
                    var loading = layer.load(1, {shade: [0.1,'#fff'] });
                    $.post("{:url('Mcard/del')}",{id:data.card_id},function(res){
                        layer.close(loading);
                        if(res.code==200){
                            layer.msg(res.msg,{time:1000,icon:1});
                            tableIn.reload(test)
                        }else{
                            layer.msg(res.msg,{time:1000,icon:2});
                        }
                    });
                    layer.close(index);
                });
            }
        });
        var layertips = null;
        $(document).on('mouseenter','.thumbs',function(){
            //console.log(event);
            var im = ('<img class="thumb-show" src="'+$(this).attr('thumbs')+'" >');
            var link = $(this).attr('href');
            //layertip=layer.tips('<img style="" src='"/ >', this, { tips:[2,'#009688'] ,area: ['宽度', '高度'],time:false});
            layertips = layer.tips( im, this, {
                tips: [2,'#009688'],
                skin: 'demo_class',
                time: false,
            });
        });

        //隐藏缩略图
        $(document).on('mouseleave','.thumbs', function() {
            layer.close(layertips);
        });
    });
</script>
{include file="public/footer"/}